﻿<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<!-- Document Meta
    ============================================= -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--IE Compatibility Meta-->
<meta name="author" content="zytheme" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="description" content="construction html5 template">
<link href="/images/favicon/favicon.ico" rel="icon">

<!-- Fonts
    ============================================= -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i%7CRaleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i%7CUbuntu:300,300i,400,400i,500,500i,700,700i' rel='stylesheet' type='text/css'>

<!-- Stylesheets
    ============================================= -->
<link href="/css/external.css" rel="stylesheet">
<link href="/css/bootstrap.min.css" rel="stylesheet">
<link href="/css/style.css" rel="stylesheet">


<!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. -->
<!--[if lt IE 9]>
      <script src="/js/html5shiv.js"></script>
      <script src="/js/respond.min.js"></script>
    <![endif]-->

<!-- Document Title
    ============================================= -->
<title>Autoshop | E-commerce Html5 Template</title>
<style type="text/css">
	.product .product-hover{
		background-color: rgba(250, 250, 250, 0.7);
	}
	.home-module-title{
		font-size: 26px;
		color:#724228;
		line-height: 36px;
	}
	.subhead{
		color: #D22E2E;
		font-family: 'Ubuntu', sans-serif;
		font-size: 12px;
		font-weight: 400;
		line-height: 8px;
		text-transform: uppercase;
		margin-bottom: 5px;
		padding-bottom: 0px;
	}
	.prodcut-title{
		font-size:16px;
		margin-bottom: 10px;
		line-height: 22px;
		color: #000000;
	}
	.foot {
	    font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial;
	    font-size: 14px;
	    color: #684029;
	    overflow-x: hidden;
	}
	.loginFont{
		color: #482618;
		text-align: center;
    	line-height: 25px;
    	font-size: 18px;
    	font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial;
	}
	.modal-body{
		text-align: center;
	}
	.sign-form{
		margin-top: 15px;
	}
</style>
</head>
<body>
     


<!-- Document Wrapper
	============================================= -->
<div id="wrapper" class="wrapper clearfix">
	<%@ include file="headNav.jsp" %>
	
	
	<!-- Page Title
============================================= -->

	<section id="shopgrid" class="shop shop-grid">
		<div class="container">
			<div class="row">
				<div class="col-xs-12 col-sm-12 col-md-3 sidebar">
					<!-- Categories
============================================= -->
					<div class="widget widget-categories">
						<div class="widget-title">
							<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">分类</span>
						</div>
						<div class="widget-content">
							<ul class="list-unstyled">
								<li>
									<a href="#"><i class="fa fa-angle-double-right"></i>蛋糕<span>(5)</span></a>
								</li>
								<li>
									<a href="#"><i class="fa fa-angle-double-right"></i>冰淇淋<span>(77)</span></a>
								</li>
								<li>
									<a href="#"><i class="fa fa-angle-double-right"></i>咖啡下午茶<span>(6)</span></a>
								</li>
							</ul>
						</div>
					</div>
					<!-- .widget-categories end -->
					
					<!-- Recent Products
============================================= -->
					<div class="widget widget-recent-products">
						<div class="widget-title">
							<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">热销商品</span>
						</div>
						<div class="widget-content">
					<!-- Product #1 -->
							<div class="product">
								<img src="/images/product/newProduct.png" width="60px" height="50px" alt="product"/>
								<div class="product-desc">
									<div class="product-title">
										<a href="#" style=" font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;">浅草</a>
									</div>
									<div class="product-meta">
										<span class="color-theme">$13.99</span>
									</div>
								</div>
							</div>
							<!-- .recent-product end -->
							
							<!-- Product #2 -->
							<div class="product">
								<img src="/images/product/dangao7.jpg" width="60px" height="50px" alt="product"/>
								<div class="product-desc">
									<div class="product-title">
										<a href="#" style=" font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;">枣儿</a>
									</div>
									<div class="product-meta">
										<span class="color-theme">$15.99</span>
									</div>
								</div>
							</div>
							<!-- .recent-product end -->
							
							<!-- Product #3 -->
							<div class="product">
								<img src="/images/product/dangao5.jpg" width="60px" height="50px" alt="product"/>
								<div class="product-desc">
									<div class="product-title">
										<a href="#" style=" font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;">百利甜情人</a>
									</div>
									<div class="product-meta">
										<span class="color-theme">$11.99</span>
									</div>
								</div>
							</div>
						</div>
						<!-- .widget-content end -->
					</div>
					<!-- .widget-recent-product end -->
					
					<!-- Filter
============================================= -->
					<div class="widget widget-filter">
						<div class="widget-title">
							<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">价格区间</span>
						</div>
						<div class="widget-content">
							<div id="slider-range"></div>
							<p>
								<label for="amount">Price: </label>
								<input type="text" id="amount" readonly>
							</p>
							<a class="btn btn-secondary" href="#">搜索</a>
						</div>
					</div>
					<!-- .widget-filter end -->
					
					<!-- Select Brand
============================================= -->
					<div class="widget widget-brands">
						<div class="widget-title">
							<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">多选</span>
						</div>
						<div class="widget-content">
							<form>
								<!-- Check #1 -->
								<div class="check-option">
									<input type="checkbox" class="checkbox-style" name="brands"   id="Opel" value="Opel">
									<label for="Opel" class="checkbox-label" >蛋糕 <span>(5)</span></label>
								</div>
								<!-- Check #2 -->
								<div class="check-option">
									<input type="checkbox" class="checkbox-style" name="brands"  id="Subaru" value="Subaru">
									<label for="Subaru" class="checkbox-label" >冰淇淋 <span>(77)</span></label>
								</div>
								<!-- Check #3 -->
								<div class="check-option">
									<input type="checkbox" class="checkbox-style" name="brands" id="BMW" value="BMW">
									<label for="BMW" class="checkbox-label" >下午茶 <span>(16)</span></label>
								</div>
			
							</form>
						</div>
					</div>
					<!-- .widget-brand end -->
					
					<!-- Recent Products
============================================= -->
					<div class="widget widget-recent-products">
						<div class="widget-title">
							<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">多选</span>
						</div>
						<div class="widget-content">
					<!-- Product #1 -->
							<div class="product">
								<img src="/images/product/newProduct.png" width="60px" height="50px" alt="product"/>
								<div class="product-desc">
									<div class="product-title">
										<a href="#" style=" font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;">浅草</a>
									</div>
									<div class="product-meta">
										<span class="color-theme">$13.99</span>
									</div>
								</div>
							</div>
							<!-- .recent-product end -->
							
							<!-- Product #2 -->
							<div class="product">
								<img src="/images/product/dangao7.jpg" width="60px" height="50px" alt="product"/>
								<div class="product-desc">
									<div class="product-title">
										<a href="#" style=" font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;">枣儿</a>
									</div>
									<div class="product-meta">
										<span class="color-theme">$15.99</span>
									</div>
								</div>
							</div>
							<!-- .recent-product end -->
							
							<!-- Product #3 -->
							<div class="product">
								<img src="/images/product/dangao5.jpg" width="60px" height="50px" alt="product"/>
								<div class="product-desc">
									<div class="product-title">
										<a href="#" style=" font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 14px; color: #684029;">百利甜情人</a>
									</div>
									<div class="product-meta">
										<span class="color-theme">$11.99</span>
									</div>
								</div>
							</div>
							<!-- .recent-product end -->
						</div>
						<!-- .widget-content end -->
					</div>
					<!-- .widget-recent-product end -->
					
					<!-- Tag Clouds
============================================= -->
					<div class="widget widget-tags">
						<div class="widget-title">
							<span style="font-family: 'PingFang SC','Heiti SC','微软雅黑',Helvetica,Arial; font-size: 16px; color: #482618;">多选</span>
						</div>
						<div class="widget-content">
							<a href="#">浅草</a>
							<a href="#">枣儿</a>
							<a href="#">芒果奶油蛋糕</a>
							<a href="#">榴莲飘飘</a>
							<a href="#">百香果酸奶酪慕斯</a>
							<a href="#">朗姆芝士</a>
							<a href="#">深爱百利甜情人蛋糕</a>
							<a href="#">布莱克</a>
							<a href="#">黑白巧克力慕斯</a>
							<a href="#">六口味切块</a>
						</div>
					</div>
					<!-- .widget-tags end -->
				</div>
				<!-- .col-md-3 end -->
				<div class="col-xs-12 col-sm-12 col-md-9">
					<!-- .row end -->
					<div class="row">
						<!-- Product #1 -->
						<div class="col-xs-12 col-sm-6 col-md-4 product">
							<div class="product-img">
								<img  src="/images/product/xiawucha.jpg" alt="Product"/>
								<div class="product-hover">
									<div class="product-action">
										<a class="btn btn-primary" href="#">加入购物车</a>
										<a class="btn btn-primary" href="#">商品详情</a>
									</div>
								</div>
								<!-- .product-overlay end -->
							</div>
							<!-- .product-img end -->
							<div class="product-bio">
								<div class="prodcut-title">				
										巴西挂耳咖啡
								</div>
								<!-- .product-title end -->
								<div class="product-price">
									<span class="symbole">$</span><span>40.00</span>
								</div>
								<!-- .product-price end -->
								
							</div>
						</div>
						<!-- .product end -->
						
												<!-- Product #1 -->
						<div class="col-xs-12 col-sm-6 col-md-4 product">
							<div class="product-img">
								<img  src="/images/product/xiawucha2.jpg" alt="Product"/>
								<div class="product-hover">
									<div class="product-action">
										<a class="btn btn-primary" href="#">加入购物车</a>
										<a class="btn btn-primary" href="#">商品详情</a>
									</div>
								</div>
								<!-- .product-overlay end -->
							</div>
							<!-- .product-img end -->
							<div class="product-bio">
								<!-- .product-cat end -->
								<div class="prodcut-title">				
										耶加雪菲挂耳咖啡
								</div>
								<!-- .product-title end -->
								<div class="product-price">
									<span class="symbole">$</span><span>40.00</span>
								</div>
								<!-- .product-price end -->
								
							</div>
						</div>
						<!-- .product end -->
						
						
												<!-- Product #1 -->
						<div class="col-xs-12 col-sm-6 col-md-4 product">
							<div class="product-img">
								<img  src="/images/product/xiawucha3.jpg" alt="Product"/>
								<div class="product-hover">
									<div class="product-action">
										<a class="btn btn-primary" href="#">加入购物车</a>
										<a class="btn btn-primary" href="#">商品详情</a>
									</div>
								</div>
								<!-- .product-overlay end -->
							</div>
							<!-- .product-img end -->
							<div class="product-bio">
		
								<!-- .product-cat end -->
								<div class="prodcut-title">				
										西达摩挂耳咖啡
								</div>
								<!-- .product-title end -->
								<div class="product-price">
									<span class="symbole">$</span><span>40.00</span>
								</div>
								<!-- .product-price end -->
								
							</div>
						</div>
						<!-- .product end -->
						
						
						
						<!-- Product #1 -->
						<div class="col-xs-12 col-sm-6 col-md-4 product">
							<div class="product-img">
								<img  src="/images/product/xiawucha4.jpg" alt="Product"/>
								<div class="product-hover">
									<div class="product-action">
										<a class="btn btn-primary" href="#">加入购物车</a>
										<a class="btn btn-primary" href="#">商品详情</a>
									</div>
								</div>
								<!-- .product-overlay end -->
							</div>
							<!-- .product-img end -->
							<div class="product-bio">
								<!-- .product-cat end -->
								<div class="prodcut-title">				
										巴布亚新几内挂耳咖啡
								</div>
								<!-- .product-title end -->
								<div class="product-price">
									<span class="symbole">$</span><span>40.00</span>
								</div>
								<!-- .product-price end -->
								
							</div>
						</div>
						<!-- .product end -->
						<!-- Product #1 -->
						<div class="col-xs-12 col-sm-6 col-md-4 product">
							<div class="product-img">
								<img  src="/images/product/xiawucha5.jpg" alt="Product"/>
								<div class="product-hover">
									<div class="product-action">
										<a class="btn btn-primary" href="#">加入购物车</a>
										<a class="btn btn-primary" href="#">商品详情</a>
									</div>
								</div>
								<!-- .product-overlay end -->
							</div>
							<!-- .product-img end -->
							<div class="product-bio">
								<!-- .product-cat end -->
								<div class="prodcut-title">				
										巴西挂耳咖啡（十包装）
								</div>
								<!-- .product-title end -->
								<div class="product-price">
									<span class="symbole">$</span><span>40.00</span>
								</div>
								<!-- .product-price end -->
								
							</div>
						</div>
						<!-- .product end -->

						

						
					</div>
					<!-- .row end -->
					
				</div>
				<!-- .col-md-9 end -->
			</div>
			<!-- .row end -->
		</div>
		<!-- .container end -->
	</section>
	<!-- #shopgrid end -->
	
	<%@ include file="footer.jsp" %>
</div>
<!-- #wrapper end -->

<!-- Footer Scripts
============================================= -->
<script src="/js/jquery-2.2.4.min.js"></script>
<script src="/js/plugins.js"></script>
<script src="/js/functions.js"></script>
<%@ include file="publicJsp.jsp" %>
</body>
</html>
